<!DOCTYPE html>
<html>
<head lang="en">
	<meta charset="UTF-8">
<title>图片轮换</title>
	<link rel="stylesheet" href="css/scroll.css">

</head>

<body>
<div class="scroll">
	<div id="num">
		<a href="#" onclick="shiftPic(this);">1</a>
		<a href="#" onclick="shiftPic(this);">2</a>
		<a href="#" onclick="shiftPic(this);">3</a>
		<a href="#" onclick="shiftPic(this);">4</a>
		<a href="#" onclick="shiftPic(this);">5</a>
	</div>
	<img src="images/1.gif" alt="图片" id="photo"/>
	

</div>
<script type="text/javascript">

	
	function shiftPic(e){
		
	var num= parseInt(e.innerHTML)
	
	switch (num){
		case 1:
		var m=document.getElementById("photo");
			m.setAttribute("src","images/1.gif");
		
			break;
		case 2:
		var m=document.getElementById("photo");
			m.setAttribute("src","images/2.gif");
		
			break;
			case 3:
		var m=document.getElementById("photo");
			m.setAttribute("src","images/3.jpg");
		
			break;
			case 4:
		var m=document.getElementById("photo");
			m.setAttribute("src","images/4.jpg");
		
			break;
			case 5:
		var m=document.getElementById("photo");
			m.setAttribute("src","images/5.gif");
		
			break;
			
		default:
			break;
	}
		
		
		
	}
	
document.getElementById("num").style.top="150px";


	
</script>


</body>
</html>
